//轮播图接口
$.get("./goodsAndShoppingCart/bannerGet.php", function(date) {

    let arr = JSON.parse(date);
    console.log(arr);
    for (let i = 0; i < arr.length; i++) {
        let li = $("<a href='huodong.html'><li class='lis'></li></a>");
        $('.lun').append($(li))
    }
  
    let oLis = document.querySelectorAll(".lis");
    let b = new Banner(oBox, oBtnPrev, oBtnNext, oLis, arr);
    b.eventBind();

})
let oBox = document.querySelector("#lunbo-con");
let oBtnPrev = document.querySelector("#btn-previous");
let oBtnNext = document.querySelector("#btn-next");



class Banner {
    constructor(box, btnPrev, btnNext, lis, arr) {
        this.index = 0;
        this.oBox = box;
        this.oBtnPrev = btnPrev;
        this.oBtnNext = btnNext;
        this.oLis = lis;
        this.arr = arr;


    }

    //工具方法
    //设置box的背景
    setBoxBgc() {

        this.oBox.style.backgroundImage = `url(img/${this.arr[this.index].img})`;
    }

    //设置li颜色
    setLiColor() {
        for (let i = 0; i < this.oLis.length; i++) {
            if (this.index == i) {
                this.oLis[i].style.backgroundColor = `white`;
            } else {
                this.oLis[i].style.backgroundColor = `gray`;
            }
        }
    }

    next() {
        this.index++;

        if (this.index == this.oLis.length) {
            this.index = 0;
        }

        this.setBoxBgc();
        this.setLiColor();
    }

    prev() {
        this.index--;

        if (this.index == -1) {
            this.index = this.oLis.length - 1;
        }

        this.setBoxBgc();
        this.setLiColor();
    }

    clickLi() {
        let that = this;
        for (let i = 0; i < this.oLis.length; i++) {
            this.oLis[i].onclick = function() {
                that.index = i;
                that.setBoxBgc();
                that.setLiColor();
            }
        }
    }

    eventBind() {
        let that = this;
        this.oBtnNext.onclick = function() {
            that.next();
        }
        this.oBtnPrev.onclick = function() {
            that.prev();
        }
        this.clickLi();
        that.oBox.onmouseout = function() {
            clearInterval(time);
            time = setInterval(function() {
                that.next();
            }, 4000)
        }
        let time = setInterval(function() {
            that.next();
            that.oBox.onmouseover = function() {
                clearInterval(time);
            }
        }, 1000)
    }
}


//首页最新商品接口
//$.get("./goodsAndShoppingCart/getGoodsListNew.php"{
//  typeId: 
 //   count:
//})